<template>
	<view class="mainpadding2">
		<view class="flexleft flex_wrap">
			<view class="huibox flexleft" v-for="item in dataAll" :key="item.id" @click="edititems(item)">
				<text
					class="margin_right2">{{item.start_time}}-{{item.end_time}}</text>
				<u-icon name="edit-pen-fill" color="#1ba95b" size="18" @click="edititem(item)"></u-icon>
			</view>
		</view>
		<view class="gudingdb mainpadding" @click="show=true">
			<view class="bigbtn">添加时间表</view>
		</view>
		<u-modal :show="show" title="添加时间表" confirmText="确认" @confirm="chongzhi" cancelText="取消"
			@cancel="chongzhicancel" showCancelButton>
			<view class="slot-content" style="width: 600rpx;">
				<view class="flexbetween margin_top" @click="timetype=1;messageTime.timeShow=true;">
					<view class="main_size bold hei_text">开始时间：</view>
					<view class="flexright">
						<input type="text" class="textright" placeholder="请选择" disabled
							v-model="start_time">
						<u-icon name="arrow-right" color="#999" size="16"></u-icon>
					</view>
				</view>
				<view class="flexbetween margin_top" @click="timetype=2;messageTime.timeShow=true;">
					<view class="main_size bold hei_text">结束时间：</view>
					<view class="flexright">
						<input type="text" class="textright" placeholder="请选择" disabled
							v-model="end_time">
						<u-icon name="arrow-right" color="#999" size="16"></u-icon>
					</view>
				</view>
				<view class="bigbtn margin_top6" v-if="listid" @click="delitem">删除</view>
			</view>
		</u-modal>
		<timePicker :messageTime="messageTime" @timeConfirm="timeConfirm"></timePicker>
	</view>
</template>

<script>
	const httpRequest = require("@/common/httpRequest.js")
	export default {
		data() {
			return {
				dataAll: {},
				cg_id: "",
				start_time: "",
				end_time: "",
				show: false,
				listid: "",
				type: "", //1场地管理选择时间段
				cgShow: false,
				cgList: [],
				jlShow: false,
				jlList: [],
				messageTime:{
					timeShow:false,
					title:"选择时间",
					mode:"time",//date日期，datetime年月日时分秒，time时间
				},
				timetype:1,
				user_zbfapply_listid:""
			}
		},
		onLoad(options) {
			this.user_zbfapply_listid=options.user_zbfapply_listid
			if(options.type){
				this.type=options.type
			}
			this.getDetail()
		},
		methods: {
			edititem(item){
				this.start_time = item.start_time
				this.end_time = item.end_time
				this.listid = item.id
				this.show = true
			},
			edititems(item){
				if(this.type==1){
					uni.$emit("checktime",item)
					uni.navigateBack(1)
				}else{
					this.edititem(item)
				}
			},
			timeConfirm(e){
				if(this.timetype==1){
					this.start_time = e
				}else{
					this.end_time = e
				}
			},
			delitem(){
				httpRequest.request('/api/cgcl/deleteCgTime', 'GET', {
					id:this.listid,
					user_zbfapply_id:this.user_zbfapply_listid
				}, false, false, true).then(res => {
					httpRequest.toast(res.msg)
					if (res.code == 1) {
						this.chongzhicancel()
						this.getDetail()
					}
				})
			},
			chongzhicancel() {
				this.start_time = ""
				this.end_time = ""
				this.listid = ""
				this.show = false
			},
			chongzhi() {
				let url = "/api/cgcl/addCgTime"
				let data = {
					start_time:this.start_time,
					end_time:this.end_time,
					user_zbfapply_id:this.user_zbfapply_listid
				}
				if (this.listid) {
					this.$set(data, "id", this.listid)
					url = "/api/cgcl/editCgTime"
				}
				httpRequest.request(url, 'GET', data).then(res => {
					httpRequest.toast(res.msg)
					if (res.code == 1) {
						this.chongzhicancel()
						this.getDetail()
					}
				})
			},
			addkc(val) {
				this.week_num = val
				this.show = true
			},
			getDetail() {
				httpRequest.request("/api/cgcl/getCgTimeIndex", 'GET', {
					user_zbfapply_id:this.user_zbfapply_listid
				}).then(res => {
					this.dataAll = res.data
				})
			}
		}
	}
</script>

<style>
	.huibox {
		padding: 10rpx 20rpx;
		border-radius: 50rpx;
		color: #999;
		margin: 30rpx 30rpx 0 0;
		background-color: #f7f7f7;
		font-size: 26rpx;
	}
</style>